import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:just_interview/experience.dart';
import 'package:just_interview/sub_type.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return AnnotatedRegion<SystemUiOverlayStyle>(
      value: SystemUiOverlayStyle(
        statusBarColor: Color(0xfffdf7fe),
        systemNavigationBarColor: Color(0x00ffffff),
        statusBarIconBrightness: Brightness.dark,
        systemNavigationBarIconBrightness: Brightness.dark,
      ),
      child: MaterialApp(
        title: 'Flutter Demo',
        debugShowCheckedModeBanner: false,
        theme: ThemeData(
          colorScheme: ColorScheme.fromSeed(seedColor: Colors.deepPurple),
          useMaterial3: true,
          appBarTheme: AppBarTheme(
            surfaceTintColor: Colors.transparent,
            scrolledUnderElevation: 0,
          ),
        ),
        home: MyHomePage(title: '😋ZQC专属面经'),
      ),
    );
  }
}

class MyHomePage extends StatefulWidget {
  const MyHomePage({super.key, required this.title});

  final String title;

  @override
  State<MyHomePage> createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> with TickerProviderStateMixin {
  late TabController _tabController;

  @override
  void initState() {
    _tabController = TabController(
      length: getAllTechTypes().length,
      vsync: this,
    );
    _tabController.addListener(() {
      setState(() {});
    });
    super.initState();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Theme.of(context).colorScheme.inversePrimary,
        title: Text(
          widget.title,
          style: TextStyle(
            fontSize: 16,
            fontWeight: FontWeight.normal,
          ),
        ),
      ),
      body: Row(
        children: [
          Container(
            width: 200, // 固定宽度
            color: Theme.of(context).colorScheme.primary.withOpacity(0.1),
            child: ListView(
              children: getAllTechTypes().map((ele) {
                return ListTile(
                  title: Text(ele["second_type"]),
                  onTap: () {
                    // 切换到相应的标签页
                    int index = getAllTechTypes().indexOf(ele);
                    _tabController.animateTo(index);
                  },
                );
              }).toList(),
            ),
          ),
          Expanded(
            child: TabBarView(
              controller: _tabController,
              children: getAllTechTypes().map((ele) {
                return ListView(
                  children: [
                    Container(
                      margin: EdgeInsets.all(10),
                      child: Wrap(
                        spacing: 10,
                        runSpacing: 10,
                        children:
                            getAllTechSubTypes(ele["second_type"]).map((e) {
                          return Container(
                            width: (MediaQuery.of(context).size.width - 240) /
                                3, // 适应左侧导航栏宽度
                            child: GestureDetector(
                              onTap: () {
                                Navigator.of(context).push(MaterialPageRoute(
                                  builder: (context) {
                                    return SubTypePage(
                                      keyword:
                                          "【技术】【${ele['second_type']}】【${e['third_type']}】",
                                    );
                                  },
                                ));
                              },
                              child: MouseRegion(
                                cursor: SystemMouseCursors.click,
                                child: Card(
                                  child: Container(
                                    padding: EdgeInsets.symmetric(
                                        horizontal: 25, vertical: 15),
                                    child: Row(
                                      mainAxisAlignment:
                                          MainAxisAlignment.spaceBetween,
                                      children: [
                                        Column(
                                          crossAxisAlignment:
                                              CrossAxisAlignment.start,
                                          children: [
                                            Text(
                                              e["third_type"],
                                              style: TextStyle(
                                                fontSize: 16,
                                                fontWeight: FontWeight.normal,
                                              ),
                                            ),
                                            Container(height: 5),
                                            Text(
                                              e["count"].toString() + "篇",
                                              style: TextStyle(
                                                color: Colors.grey[600],
                                                fontSize: 14,
                                                fontWeight: FontWeight.normal,
                                              ),
                                            ),
                                          ],
                                        ),
                                        Icon(Icons.chevron_right),
                                      ],
                                    ),
                                  ),
                                ),
                              ),
                            ),
                          );
                        }).toList(),
                      ),
                    ),
                  ],
                );
              }).toList(),
            ),
          ),
        ],
      ),
    );
  }
}
